<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>登录注册界面</title>
	<link rel="stylesheet" href="__PUBLIC__/home/css/hwlayer.css">
	<link rel="stylesheet" href="__PUBLIC__/home/css/bootstrap.min.css">
	<script src="__PUBLIC__/home/js/jquery.min.js"></script>
	<script src="__PUBLIC__/home/js/jquery.validate.min.js"></script>
	<script src="__PUBLIC__/home/js/bootstrap.min.js"></script>
	<script>
		$(function(){
			$("#login-form").validate({
			    rules: {
			      user: {
			      	required:true
			      },
			      password: {
			      	required:true,
			      	rangelength:[6,12]
			      },
			      code:{
			      	required:true,
			      	remote:{
			      		url:"{:U('Login/ajaxCheckVerify')}",
			      		type:"post",
			      		dataType:"json",
			      		dataFilter:function(data){
			      			if(data=="true"){
			      				return true;
			      			}else{
			      				return false;
			      			}
			      		}
			      	}
			      }
			    },
			    messages: {
			      user: {
			      	required:"请输入您的名字"
			      },
			      password:{
			      	required:"请输入您的密码",
			      	rangelength:"密码长度为6-12位"	
			      },
			      code:{
			      	required:"请输入验证码(请输入小写英文字母)",
			      	remote:"输入有误"
			    }
			 },   
			    // 当验证失败的时候会做的事情
				errorPlacement: function(error, element) { 
					console.log(error);
					console.log(element);
					element.parents(".form-group").append(error);
					element.parents(".form-group").addClass("has-error");
				},success: function(element) {
					// alert(element.html());
					element.parents(".form-group").removeClass("has-error");
					element.remove();
				}
			});
		})
	</script>
	<style>
	.hw-overlay{display: block;}
	.hw-layer-wrap{top:24%;}
	</style>
</head>
<body>
	<div class="hw-overlay" id="hw-layer-login">
            <div class="hw-layer-wrap">
                <h3 class="hw-layer-title">用户登录
                	<a href="index.php" class="btn btn-success">返回首页</a>
                </h3>
                <div class="row">
                    <form class="form-horizontal" action="{:U('Login/selectUser')}" method="post" id="login-form" onsubmit="rememberPw()">
                        <div class="form-group">
                            <div class="input-group">
                                <div class="input-group-addon"><i class="glyphicon glyphicon-user"></i></div>
                                <input type="text" class="form-control" name="user" id="user" placeholder="请输入用户名">
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="input-group">
                                <div class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></div>
                                <input type="password" class="form-control" name="password" id="password" placeholder="请输入密码">
                            </div>
                        </div>
                        <div class="form-group">
					    	<div class="col-sm-10">
					      		<div class="checkbox">
						        	<label>
						          	<input type="checkbox" name="checked" id="remember">记住密码？
						        	</label>
					      		</div>
					    	</div>
					    </div>	
					    <div class="form-group">
					    	<div class="col-sm-10">
								<div class="Verify">
						        	<label for="">请填写验证码</label>
						          	<input type="text" name="code">
						        	<img src="{:U('Login/get_v')}" title="点击刷新" alt="验证码图片" id="verifyImg" onclick="fleshVerify()">
					      		</div>
					    	</div>
						</div>
                        <div class="form-group">
                            <div class="col-sm-12">
                                <button type="submit" class="btn btn-success hwLayer-ok col-sm-12">登录</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
		<script type="text/javascript">
		$(function(){
			var dt = localStorage.getItem("rememberHome");
			if(dt=='true'){
				var name = localStorage.getItem("nameHome");
				var password = localStorage.getItem("passwordHome");
				$("input[name='user']").val(name);
				$("input[name='password']").val(password);
				$("#remember").prop("checked",true);
			}else{
				$("#remember").prop("checked",false);
			}
		})
		function rememberPw(){
			if($("#remember").prop("checked")){
				localStorage.setItem("rememberHome",'true');
				localStorage.setItem("nameHome",$("input[name='user']").val());
				localStorage.setItem("passwordHome",$("input[name='password']").val());
			}else{
				localStorage.clear();
			}
		}
		function fleshVerify(){
			//重载验证码
			var time = new Date().getTime();
			document.getElementById("verifyImg").src= "{:U('Login/get_v')}"+"&random="+time;
		}
	</script>
</body>
</html>